@extends('layout.default')

@section('stylesheet')
  <link href="//cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet">
@stop

@section('layout.content')

  <div class="row">
    <div class="col-xs-12">
      <h4 class="header blue">{{$plan->title}}>{{$plan->name}}{{isset($category)?'>'.$category->name:''}} </h4>
    </div>
  </div>

  <div class="row">
    <div class="col-xs-12">
      <form class="form-horizontal" id="staff-create" autocomplete="off">
        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right"> 培训计划： </label>
          <label class="col-sm-8 control-label align-left">
            <b>{{$plan->name}}</b>
            <input type="hidden" name="plan_id" value="{{$plan->id}}"/>
          </label>
        </div>
        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right"> 发布方案： </label>
          <label class="col-sm-8 control-label align-left">
            <b>{{$publish->name}}</b>
            <input type="hidden" name="publish_id" value="{{$publish->id}}"/>
          </label>
        </div>
        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="user" style="margin-top: 4px;"> <b><span
                  class="red">*</span> 报名学生：</b> </label>
          <div class="col-sm-6">
            <div class="input-group">
              <input type="text" class="form-control" name="user" placeholder="帐号/姓名/手机号码"
                     style="padding:0 10px;height:45px;font-size:18px;font-weight: bold;" autocomplete="off"/>
              <span class="input-group-btn">
              <a href="{{route('bank.user.create')}}" class="btn btn-inverse"
                 style="height:45px;padding:10px 12px 0 16px;font-size:18px;">
                <i class="ace-icon fa fa-user-plus"></i>
              </a>
            </span>
            </div>
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right"> <b><span
                  class="red">*</span> {!!$plan->present()->categoryTitle!!}：</b> </label>
          <div class="col-sm-10">
            <table name="tb" class="table table-hover table-striped table-bordered">
              <thead>
              <tr>
                <th class="center" style="width:60px;">选择</th>
                <th class="center" style="width:210px;">{!!$plan->present()->categoryTitle!!}名称</th>
                <th class="center" style="width:70px;">招收</th>
                <th class="center" style="width:70px;">报名</th>
                <th class="center" style="width:70px;">限招</th>
                <th class="center" style="width:70px;">考试</th>
                <th class="center" style="width:140px;">上课时间</th>
              </tr>
              </thead>
              <tbody>
              @foreach ($publish->grades as $grade)

                <tr>
                  <td class="center">
                    <input name="gid" type="checkbox" value="{{$grade->id}}" class="ace ace-checkbox-2"
                           data-category-id="{{$grade->cid}}">
                    <span class="lbl"> </span>
                  </td>
                  <td class="align-middle">{{ $grade->name }}</td>
                  <td class="center b-borrow">{{ $grade->number }}</td>
                  <td class="center b-return">{{ $grade->enrols->count() }}</td>
                  <td class="center">{!! $grade->present()->LimitedStatus !!}</td>
                  <td class="center">{!! $grade->present()->ExamStatus !!}</td>
                  <td class="align-middle center">
                    {!! $grade->present()->WeekDay !!}<br/>
                    {{ date('H:i',strtotime($grade->grade_begin)) }}-{{ date('H:i',strtotime($grade->grade_end)) }}
                  </td>

                </tr>
              @endforeach
              </tbody>
            </table>
          </div>
        </div>


        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right"> </label>
          <div class="col-sm-4">
            <button type="button" class="btn btn-primary submit">
              <i class="ace-icon fa fa-check"></i>
              <span class="">确定</span>
            </button>
          </div>
        </div>

      </form>
    </div>
  </div>

@stop

@section('javascript')
  <script src="//cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"></script>

  <script type="text/javascript">
      $(function () {

          $("input:checkbox[name='gid']").on('click', function (e) {
              $("input:checkbox[name='gid']").not(this).attr("checked", false);
          });

          var uid = $("input[name='user']").data('id');

          $("input[name='user']").autocomplete({
              source: function (request, response) {
                  $.get('{{route('util.users')}}', {
                      'term': request.term,
                  }, function (data) {
                      response($.map(data, function (item) {
                          return {
                              label: item.account + '　' + item.name + '　' + item.mobile,
                              value: item.account + '　' + item.name + '　' + item.mobile,
                              id: item.id
                          }
                      }));

                  }, 'json');
              },

              select: function (e, ui) {
                  uid = ui.item.id;
              },
              minLength: 2,
          });


          $('.submit').on('click', function () {

              var uri = '{{route('education.enrol.store', array($plan->id))}}';

              $.post(uri, {
                  '_token': $("input[name='_token']").attr('value'),
                  'grade_id': $("input[name='gid']:checked").val(),
                  'publish_id': $("input[name='publish_id']").val(),
                  'plan_id': $("input[name='plan_id']").val(),
                  'category_id': $("input[name='gid']:checked").data('category-id'),
                  'uid': uid,
                  'source': 2,
                  'is_submit': true
              }, function (data) {
                  layer.msg(data.message, {time: 1000, shift: -1}, function () {
                      if (data.status === true && data.url != null) {
                          $(window).attr('location', data.url);
                      }
                  });

              }, 'json').error(function (data) {
                  layer.msg(data.responseJSON.message);
              });

          });


      });
  </script>
@stop